<template>
	<view class="settle">
		<!-- 全选 -->
		<label class="radio"  @click="changeallgoods">
			<radio  color="#c00000" :checked="isFullcheck"/><text>全选</text>
		</label>
		<!-- 合计 -->
		<view class="total-box">
			合计:<text class="monery">￥{{allmonery}}</text>
		</view>
		<!-- 结算 -->
		<view class="btn-stelle" @click="settlement">
			结算({{checkcount}})
		</view>
	</view>
</template>

<script>
	import {mapGetters,mapMutations,mapState} from 'vuex'
	export default {
		name:"my-settle",
		data() {
			return {
				 seconds:3, //倒计时的秒数
				 timer:null //定时器的id
			};
		},
		computed:{
			...mapGetters('m_cart',['checkcount','total','allmonery']),
			...mapGetters('m_user',['addstr']),
			...mapState('m_user',['token']),
			...mapState('m_cart',['cart']),
			isFullcheck(){
				return this.total == this.checkcount
			}
		},
		methods:{
			...mapMutations('m_cart',['upallgoodsstate']),
			...mapMutations('m_user',['updaredirectInfo']),
			changeallgoods(){
				this.upallgoodsstate(!this.isFullcheck)
			},
			// 结算按钮点击事件处理
			settlement(){
				if(!this.checkcount) return uni.$showMsg("请选择要结算的商品")
				if(!this.addstr) return uni.$showMsg("请选择要收货的地址")
				if(!this.token) return this.delaynavigate()
				// 付费订单
				this.payOrder()
			},
			async payOrder(){
				// 1创建订单
				// 组织订单对象
				const orderinfo = {
					order_price:0.01,
					consignee_addr:this.addstr,
					goods:this.cart.filter(x=>x.goods_state).map(x=>({
						goods_id:x.goods_id,
						goods_number:x.goods_count,
						goods_price:x.goods_price
					})),
					
				}
				//发起请求创建订单
				 const {data:res} =  await uni.$http.post('/api/public/v1/my/orders/create',orderinfo)
				 if(res.meta.status!=200) return uni.$showMsg("创建订单失败")
				 // 得到服务器返回的订单编号
				 const ordernumber = res.message.order_number
				 
				 // 2订单预支付
				 // 发起请求获取订单信息
				 const {data :respay} = await uni.$http.post('/api/public/v1/my/orders/req_unifiedorder',{
					 order_number:ordernumber
				 })
				if(respay.meta.status!=200) return uni.$showMsg("订单生成失败")
				const payInfo = respay.message.pay
				// console.log(payInfo)
				// 3 发起微信支付
				// const [err, succ] = await uni.requestPayment(payInfo)
				// if(err) return uni.$showMsg("订单未支付！")
				 await uni.requestPayment({
				          ...payInfo,
				          success: (res4) => {
				            console.log('success', res4)
				            // {errMsg: "requestPayment:ok"}
				            if (res4.errMsg === 'requestPayment:ok') {
				              return uni.$showError('订单支付成功！')
				            }
				          },
				          fail: (err4) => {
				            console.log('fail', err4)
				            // {errMsg: "requestPayment:fail cancel"}
				            if (err4.errMsg === 'requestPayment:fail cancel') {
				              return uni.$showError('您取消了支付！')
				            }
				          },
				          complete: () => {
				            console.log('pay complete')
				          }
				        })
				
				
				const {data:rescheck} = await uni.$http.post('/api/public/v1/my/orders/chkOrder',{
					order_number:ordernumber
				})
				console.log(rescheck)
				if(rescheck.meta.status!=200) uni.$showMsg('订单未支付')
				uni.showToast({
					title:'订单支付完成',
					icon:"success"
				})
			},
			// 展示倒计时的提示消息
			showTips(n){
				uni.showToast({
					icon:"none",
					title:'请登录后再结算！'+n+'秒后自动跳转到登录页',
					mask:true,
					duration:1500
				})
			},
			// 延时导航到profile页面
			delaynavigate(){
				this.seconds = 3
				this.showTips(this.seconds)
				this.timer =  setInterval(()=>{
					this.seconds--
					if(this.seconds <=0){
						clearInterval(this.timer)
						uni.switchTab({
							url:"/pages/profile/profile",
							success: () => {
								this.updaredirectInfo({
									openType:"switchTab",
									from :'/pages/cart/cart'
								})
							}
						})
						return
					}
					this.showTips(this.seconds)
				},1000)
				
			}
		}
	}
</script>

<style>
.settle{
	font-size: 14px;
	height: 50px;
	width: 100%;
	position: fixed;
	left: 0px;
	bottom: 0px;
	background-color: pink;
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.monery{
	font-size: 16px;
	font-weight: 700;
	color: #c00000;
}
.btn-stelle{
	box-sizing: border-box;
	width: 100px;
	height: 100%;
	background-color: red;
	line-height: 50px;
	text-align: center;
	color: #ffff;
}
</style>
